/*
 * @Author: Choisaaaa
 * @Date: 2018/5/5  12:26
 * 订单查找组件
 */

import React from "react";
import {Link} from "react-router-dom";

import Footer from "component/footer/footer.jsx";
import OrderListSearch from "./order-list-search.jsx"
import PageTitle from 'component/page-title/page-title.jsx';
import TableList from 'util/table-list/table-list.jsx';
import OrderDetailInfo from "./order-detail-component.jsx"
import MUtil from 'util/mm.jsx'
import Order from 'service/order-service.jsx'

const _mm = new MUtil();
const _order = new Order();

class OrderFind extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            pageNum : 1 ,
            orderInfo : {}
        }
    }

    OnSearch(orderNumber) {//存储子组件OrderListSearch发送过来的orderNumber
        let checkOrderNumber =_order.checkOrderNumber(orderNumber);
        if(checkOrderNumber.status){
            _order.getOrderDetail(orderNumber).then((res) =>{
                this.setState({
                    orderInfo: res
                });
            },(resMsg) =>{
                _mm.errorTips(resMsg)
            });
            // window.location.href = `/order/detail/${orderNumber}`;
        }else{
            _mm.errorTips(checkOrderNumber.msg)
        }
    }

    render(){
        let receiverInfo = this.state.orderInfo.shippingVo || {},
            productList = this.state.orderInfo.orderItemVoList || [];
        let tableHeader = [
            {name : "商品图片" ,width : "10%"},
            {name : "商品信息" ,width : "45%"},
            {name : "单价" ,width : "15%"},
            {name : "数量" ,width : "15%"},
            {name : "合计" ,width : "15%"},
        ];
        let ListBody = productList.map((product,index) => {
            return(
                <tr key={index}>
                    <td>
                        <img className="p-img"  alt={product.productName}
                             src={`${this.state.orderInfo.imageHost}${product.productImage}`}/>
                    </td>
                    <td>{product.productName}</td>
                    <td>￥{product.currentUnitPrice}</td>
                    <td>{product.quantity}</td>
                    <td>￥{product.totalPrice}</td>
                </tr>
            )
        });
        return(
            <div id="page-wrapper">
                <PageTitle title="查找订单"/>
                <OrderListSearch onSearch={(orderNumber)=>{this.OnSearch(orderNumber)}}/>
                {
                    this.state.orderInfo.orderNo == null
                        ? null :
                        <OrderDetailInfo orderDetail = {this.state.orderInfo} />
                }
                <Footer/>
            </div>
        );
    }

}
export default OrderFind;